<template>
	<view class="container">
		<resource-group :group="group" v-for="group in groupList" v-if="group.resourceList.length>0"></resource-group>
		<uni-load-more :status="loadingType"></uni-load-more>
		<login-banner></login-banner>
	</view>
</template>

<script>
	import resourceGroup from '@/components/resource-group.vue'
	import loginBanner from '@/components/login-banner.vue'
	import {
		mapState,
		mapMutations
	} from 'vuex';
	export default {
		components: {
			resourceGroup,
			loginBanner
		},
		data() {
			return {
				loadingType: '', //加载状态
				pageNo: 1, //分页查询默认页码
				pageSize: 8, //分页查询每页数据条数
				groupList: [], //MUST KNOW资源组
			};
		},
		computed: {
			...mapState(['hasLogin', 'userInfo', 'footPrint', 'applicationConfig'])
		},
		onLoad() {
			this.searchResourceGroup();
		},
		onShow() {},
		//加载更多
		onReachBottom() {

		},
		methods: {
			//分页查询MUST-KNOW资源组(对应的数据为后台资源组设置为推荐)
			searchResourceGroup() {
				let searchData = {
					'keyArray': ['IS_ENABLED', 'IS_RECOMMEND'],
					'enabled': true,
					'recommend': true,
					'startIndex': (this.pageNo - 1) * this.pageSize,
					'pageSize': this.pageSize,
				};
				this.loadingType = 'loading';
				this.$api.request.searchResourceGroup(searchData, res => {
					uni.stopPullDownRefresh();
					if (res.body.status.statusCode === '0') {
						var groupList = res.body.data.groups;
						if (this.pageNo === 1)
							this.groupList = groupList;
						else
							this.groupList = this.groupList.concat(groupList);
						this.total = res.body.data.total;
						if (this.groupList.length >= this.total) {
							this.loadingType = 'noMore';
						} else {
							this.loadingType = 'more';
						}
					} else {
						this.loadingType = 'more';
						console.log(res.body.status.errorDesc);
					}
				}, true);
			},
		}
	}
</script>

<style lang="scss">
	page {
		background: $bg-color-light;
	}

	.container {
		margin: 0 $page-row-spacing;
	}
</style>